<template>
  <!-- 门禁授权 -->
  <div class="box">
    <el-form
      :model="ruleForm"
      ref="ruleForm"
      label-width="40px"
      class="demo-ruleForm"
      :inline="true"
      style="height:40px"
    >
      <el-form-item label="角色" prop="roleGuid">
        <el-select
          v-model="ruleForm.roleGuid"
          placeholder="请选择角色"
          size="mini"
          clearable
          style="width:150px"
        >
          <el-option
            v-for="item in roleInfo"
            :key="item.roleGuid"
            :label="item.roleName"
            :value="item.roleGuid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="部门" class="marginLift">
        <el-select
          v-model="ruleForm.departmentGuid"
          placeholder="请选择"
          size="mini"
          clearable
          style="width:150px"
        >
          <el-option label="全部部门" value></el-option>
          <el-option
            v-for="item in departmentInfo"
            :key="item.departmentGuid"
            :label="item.departmentName"
            :value="item.departmentGuid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="姓名" class="marginLift">
        <el-input
          v-model="ruleForm.userName"
          placeholder="请输入姓名"
          size="mini"
          clearable
          style="width:150px"
        ></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit" size="mini" icon="el-icon-search">查询</el-button>
      </el-form-item>
    </el-form>
    <h4>人员信息</h4>
    <div class="table_scroll">
      <el-table
        ref="multipleTable"
        :data="personnelData"
        tooltip-effect="dark"
        style="width: 100%"
        :stripe="true"
        border
        :header-cell-style="headFirst"
        @selection-change="personnelChange"
        v-loading="loadingUser"
        :cell-style="(res) => headFirst_col(res, [])"
      >
        <!-- <el-table-column type="selection" width="45" align="center"></el-table-column> -->
        <el-table-column label="是否选中" prop="isCheck" align="center" width="45">
          <template slot="header" slot-scope="scope">
            <el-checkbox :value="isUserAll" @change="CheckUserAll" />
          </template>
          <template slot-scope="scope">
            <el-checkbox
              :value="scope.row.isCheck"
              @change="(isCheck) => CheckUserSelect(isCheck, scope.row)"
            />
          </template>
        </el-table-column>
        <el-table-column prop="userNumber" label="人员编号" align="center"></el-table-column>
        <el-table-column prop="userName" label="姓名" align="center"></el-table-column>
        <el-table-column prop="cardNumber" label="卡号" align="center"></el-table-column>
        <el-table-column prop="departmentName" label="部门" align="center"></el-table-column>
      </el-table>
    </div>
    <div class="page">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChangepage"
        :current-page="currentPage"
        :page-sizes="[10,20,40,80,160]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="recordCount"
      ></el-pagination>
    </div>
    <!-- 角色管理信息显示 -->
    <h4>设备信息</h4>
    <el-form
      :inline="true"
      :model="elformTwo"
      size="mini"
      class="demo-form-inline"
      ref="elformTwo"
      v-show="activeName == 'thirdone'"
    >
      <el-form-item label="开始时间" prop="startTime">
        <el-date-picker
          v-model="elformTwo.startTime"
          type="datetime"
          placeholder="选择日期时间"
          value-format="yyyy-MM-dd HH:mm:ss"
          style="width:180px"
          size="mini"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label="结束时间" prop="endTime">
        <!-- <span class="time">至</span> -->
        <el-date-picker
          v-model="elformTwo.endTime"
          type="datetime"
          placeholder="选择日期时间"
          value-format="yyyy-MM-dd HH:mm:ss"
          :default-time="'23:59:59'"
          size="mini"
          style="width:180px"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label=" " prop="backLock">
        <el-checkbox v-model="elformTwo.backLock">反锁开门</el-checkbox>
      </el-form-item>
      <!-- <span>星期</span> -->
      <el-form-item label="星期" label-width="60px">
        <el-form-item label prop="monday">
          <el-checkbox v-model="elformTwo.monday">一</el-checkbox>
        </el-form-item>
        <el-form-item label prop="tuesday">
          <el-checkbox v-model="elformTwo.tuesday">二</el-checkbox>
        </el-form-item>
        <el-form-item label prop="wednesday">
          <el-checkbox v-model="elformTwo.wednesday">三</el-checkbox>
        </el-form-item>
        <el-form-item label prop="thursday">
          <el-checkbox v-model="elformTwo.thursday">四</el-checkbox>
        </el-form-item>
        <el-form-item label prop="friday">
          <el-checkbox v-model="elformTwo.friday">五</el-checkbox>
        </el-form-item>
        <el-form-item label prop="saturday">
          <el-checkbox v-model="elformTwo.saturday">六</el-checkbox>
        </el-form-item>
        <el-form-item label prop="sunday">
          <el-checkbox v-model="elformTwo.sunday">日</el-checkbox>
        </el-form-item>
      </el-form-item>
      <el-form-item label="星期时段">
        <el-form-item label="一" prop="mondayTimeStageIndex">
          <el-select
            v-model="elformTwo.mondayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="二" prop="tuesdayTimeStageIndex">
          <el-select
            v-model="elformTwo.tuesdayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="三" prop="wednesdayTimeStageIndex">
          <el-select
            v-model="elformTwo.wednesdayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="四" prop="thursdayTimeStageIndex">
          <el-select
            v-model="elformTwo.thursdayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="五" prop="fridayTimeStageIndex">
          <el-select
            v-model="elformTwo.fridayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="六" prop="saturdayTimeStageIndex">
          <el-select
            v-model="elformTwo.saturdayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="日" prop="sundayTimeStageIndex">
          <el-select
            v-model="elformTwo.sundayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="假日时段" prop="holidayTimeStageIndex">
          <el-select
            v-model="elformTwo.holidayTimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>
      <el-form-item label prop="door1">
        <el-checkbox v-model="elformTwo.door1">门1</el-checkbox>
      </el-form-item>
      <el-form-item label prop="door2">
        <el-checkbox v-model="elformTwo.door2">门2</el-checkbox>
      </el-form-item>
      <el-form-item label="开门密码" prop="doorPassword">
        <el-input
          placeholder="请输入密码"
          v-model="elformTwo.doorPassword"
          size="mini"
          style="width:100px"
        ></el-input>
      </el-form-item>

      <!-- <el-checkbox v-model="tuesdayChecked" class="checked">二</el-checkbox>
          <el-checkbox v-model="wednesdayChecked" class="checked">三</el-checkbox>
          <el-checkbox v-model="thursdayChecked" class="checked">四</el-checkbox>
          <el-checkbox v-model="fridayChecked" class="checked">五</el-checkbox>
          <el-checkbox v-model="saturdayChecked" class="checked">六</el-checkbox>
      <el-checkbox v-model="sundayChecked" class="checked">日</el-checkbox>-->
      <el-form-item>
        <el-button
          type="primary"
          @click="resetFilter('elformTwo')"
          size="mini"
          icon="el-icon-refresh"
        >重置条件</el-button>
        <el-button type="primary" @click="editTwoEquipment" size="mini">批量修改选中的双门控制器</el-button>
      </el-form-item>
    </el-form>
    <el-form
      :inline="true"
      :model="elformFour"
      size="mini"
      class="demo-form-inline"
      ref="elformFour"
      v-show="activeName == 'thirdtwo'"
    >
      <el-form-item label="星期">
        <el-form-item label prop="monday">
          <el-checkbox v-model="elformFour.monday">一</el-checkbox>
        </el-form-item>
        <el-form-item label prop="tuesday">
          <el-checkbox v-model="elformFour.tuesday">二</el-checkbox>
        </el-form-item>
        <el-form-item label prop="wednesday">
          <el-checkbox v-model="elformFour.wednesday">三</el-checkbox>
        </el-form-item>
        <el-form-item label prop="thursday">
          <el-checkbox v-model="elformFour.thursday">四</el-checkbox>
        </el-form-item>
        <el-form-item label prop="friday">
          <el-checkbox v-model="elformFour.friday">五</el-checkbox>
        </el-form-item>
        <el-form-item label prop="saturday">
          <el-checkbox v-model="elformFour.saturday">六</el-checkbox>
        </el-form-item>
        <el-form-item label prop="sunday">
          <el-checkbox v-model="elformFour.sunday">日</el-checkbox>
        </el-form-item>
      </el-form-item>
      <el-form-item label="门1:" label-width="60px">
        <el-form-item label prop="door1">
          <el-checkbox v-model="elformFour.door1">是否启用</el-checkbox>
        </el-form-item>
        <el-form-item label="时段" prop="door1TimeStageIndex">
          <el-select
            v-model="elformFour.door1TimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>
      <el-form-item label="门2:" label-width="60px">
        <el-form-item label prop="door2">
          <el-checkbox v-model="elformFour.door2">是否启用</el-checkbox>
        </el-form-item>
        <el-form-item label="时段" prop="door2TimeStageIndex">
          <el-select
            v-model="elformFour.door2TimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>
      <el-form-item label="门3:">
        <el-form-item label prop="door3">
          <el-checkbox v-model="elformFour.door3">是否启用</el-checkbox>
        </el-form-item>
        <el-form-item label="时段" prop="door3TimeStageIndex">
          <el-select
            v-model="elformFour.door3TimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>
      <el-form-item label="门4:" label-width="60px">
        <el-form-item label prop="door4">
          <el-checkbox v-model="elformFour.door4">是否启用</el-checkbox>
        </el-form-item>
        <el-form-item label="时段" prop="door4TimeStageIndex">
          <el-select
            v-model="elformFour.door4TimeStageIndex"
            placeholder="请选择"
            style="width:75px"
            size="mini"
          >
            <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>

      <el-form-item>
        <el-button
          type="primary"
          @click="resetFilter('elformFour')"
          size="mini"
          icon="el-icon-refresh"
        >重置条件</el-button>
        <el-button type="primary" @click="editFourEquipment" size="mini">批量修改选中的四门控制器</el-button>
      </el-form-item>
    </el-form>
    <el-tabs type="border-card" v-model="activeName">
      <el-tab-pane label="双门控制器" name="thirdone">
        <div class="my_table">
          <el-table
            v-loading="loading"
            :data="detailslist"
            ref="twoTable"
            border
            highlight-current-row
            :header-cell-style="header => headFirst(header, 2)"
            @selection-change="equipmentChange"
            style="width: 100%"
            :cell-style="(res) => headFirst_col(res, [],2)"
          >
            <!-- <el-table-column
              type="selection"
              width="40"
              align="center"
              v-if="isauth('access_auth_edit')"
            ></el-table-column>-->
            <el-table-column label="是否选中" prop="isCheck" align="center" width="35">
              <template slot="header" slot-scope="scope">
                <el-checkbox :value="isTwoAll" @change="CheckTwoAll" />
              </template>
              <template slot-scope="scope">
                <el-checkbox
                  :value="scope.row.isCheck"
                  @change="(isCheck) => CheckTwoSelect(isCheck, scope.row)"
                />
              </template>
            </el-table-column>
            <el-table-column prop="terminalCode" label="设备编号" align="center" min-width="100px"></el-table-column>
            <el-table-column prop="terminalName" label="设备名称" align="center" min-width="100px"></el-table-column>
            <!-- 有效时间 -->
            <el-table-column prop="startTime" label="开始时间" align="center" width="190px">
              <template slot-scope="scope">
                <el-date-picker
                  v-model="scope.row.startTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  size="mini"
                  style="width:180px"
                  @change="handleTwoSelect(scope.row)"
                  :disabled="!isauth('access_auth_edit')"
                ></el-date-picker>
              </template>
            </el-table-column>
            <!-- 有效时间 -->
            <el-table-column prop="endTime" label="结束时间" align="center" width="190px">
              <template slot-scope="scope">
                <el-date-picker
                  v-model="scope.row.endTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  :default-time="'23:59:59'"
                  size="mini"
                  style="width:180px;"
                  @change="handleTwoSelect(scope.row)"
                  :disabled="!isauth('access_auth_edit')"
                ></el-date-picker>
              </template>
            </el-table-column>
            <el-table-column prop="backLock" label="反锁开门" align="center" width="35px">
              <template slot-scope="scope">
                <el-checkbox v-model="scope.row.backLock" @change="handleTwoChange(scope.row)"></el-checkbox>
              </template>
            </el-table-column>
            <!-- 开门-礼拜 -->
            <el-table-column prop="Sunday" label="星期" align="center">
              <el-table-column prop="monday" label="一" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.monday"
                    style="padding:0"
                    :disabled="!isauth('access_auth_edit')"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="tuesday" label="二" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.tuesday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="wednesday" label="三" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.wednesday"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="thursday" label="四" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.thursday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="friday" label="五" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.friday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="saturday" label="六" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.saturday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="sunday" label="日" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.sunday"
                  ></el-checkbox>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 星期时段 -->
            <el-table-column prop="SundayTime" label="星期时段" align="center">
              <el-table-column prop="mondayTimeStageIndex" label="一" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.mondayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="tuesdayTimeStageIndex" label="二" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.tuesdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>

              <el-table-column prop="wednesdayTimeStageIndex" label="三" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.wednesdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>

              <el-table-column prop="thursdayTimeStageIndex" label="四" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.thursdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="fridayTimeStageIndex" label="五" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.fridayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="saturdayTimeStageIndex" label="六" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.saturdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="sundayTimeStageIndex" label="日" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.sundayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 假日时段 -->
            <el-table-column prop="holidayTimeStageIndex" label="假日时段" align="center" width="75px">
              <template slot-scope="scope">
                <el-select
                  v-model="scope.row.holidayTimeStageIndex"
                  placeholder="请选择"
                  @change="handleTwoSelect(scope.row)"
                  size="mini"
                  :disabled="!isauth('access_auth_edit')"
                >
                  <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- 门1 -->
            <el-table-column prop="door1" label="门1" align="center" width="50px">
              <template slot-scope="scope">
                <el-checkbox
                  v-model="scope.row.door1"
                  @change="handleTwoChange(scope.row)"
                  :disabled="!isauth('access_auth_edit')"
                ></el-checkbox>
              </template>
            </el-table-column>
            <!-- 门2 -->
            <el-table-column prop="door2" label="门2" align="center" width="50px">
              <template slot-scope="scope">
                <el-checkbox
                  v-model="scope.row.door2"
                  @change="handleTwoChange(scope.row)"
                  :disabled="!isauth('access_auth_edit')"
                ></el-checkbox>
              </template>
            </el-table-column>
            <!-- 开门密码 -->
            <el-table-column prop="doorPassword" label="开门密码" align="center">
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.doorPassword"
                  size="mini"
                  :disabled="!isauth('access_auth_edit')"
                ></el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="page">
          <el-pagination
            @size-change="deviceSizeChange"
            @current-change="deviceCurrentChangepage"
            :current-page="deviceCurrentPage"
            :page-sizes="[3,5,10, 20, 30]"
            :page-size="devicePageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="devicerecordCount"
          ></el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="四门控制器" name="thirdtwo">
        <div class="my_table">
          <el-table
            v-loading="loading1"
            :data="fourDoorList"
            ref="fourTable"
            border
            highlight-current-row
            :header-cell-style="header => headFirst(header, 2)"
            @selection-change="fourChange"
            style="width: 100%"
            :cell-style="(res) => headFirst_col(res, [],2)"
          >
            <!-- <el-table-column
              type="selection"
              width="45"
              align="center"
              v-if="isauth('access_auth_edit')"
            ></el-table-column>-->
            <el-table-column label="是否选中" prop="isCheck" align="center" width="45">
              <template slot="header" slot-scope="scope">
                <el-checkbox :value="isFourAll" @change="CheckFourAll" />
              </template>
              <template slot-scope="scope">
                <el-checkbox
                  :value="scope.row.isCheck"
                  @change="(isCheck) => CheckFourSelect(isCheck, scope.row)"
                />
              </template>
            </el-table-column>
            <el-table-column prop="terminalCode" label="设备编号" align="center" min-width="110px"></el-table-column>
            <el-table-column prop="terminalName" label="设备名称" align="center" min-width="120px"></el-table-column>
            <!-- 开门-礼拜 -->
            <el-table-column prop="Sunday" label="星期" align="center">
              <el-table-column prop="monday" label="一" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.monday"
                    style="padding:0"
                    :disabled="!isauth('access_auth_edit')"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="tuesday" label="二" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.tuesday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="wednesday" label="三" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.wednesday"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="thursday" label="四" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.thursday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="friday" label="五" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.friday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="saturday" label="六" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.saturday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="sunday" label="日" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.sunday"
                  ></el-checkbox>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门1 -->
            <el-table-column prop="door1" label="门1" align="center" width="50px">
              <el-table-column prop="door1" label="是否启用" align="center" width="45px">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.door1"
                    :disabled="!isauth('access_auth_edit')"
                    @change="handleFourChange(scope.row)"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door1TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door1TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门2 -->
            <el-table-column prop="door2" label="门2" align="center" width="50px">
              <el-table-column prop="door2" label="是否启用" align="center" width="45px">
                <template slot-scope="scope">
                  <el-checkbox v-model="scope.row.door2" @change="handleFourChange(scope.row)"></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door2TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door2TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门3 -->
            <el-table-column prop="door3" label="门3" align="center" width="50px">
              <el-table-column prop="door3" label="是否启用" align="center" width="45px">
                <template slot-scope="scope">
                  <el-checkbox v-model="scope.row.door3" @change="handleFourChange(scope.row)"></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door3TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door3TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门4 -->
            <el-table-column prop="door4" label="门4" align="center" width="50px">
              <el-table-column prop="door4" label="是否启用" align="center" width="45px">
                <template slot-scope="scope">
                  <el-checkbox v-model="scope.row.door4" @change="handleFourChange(scope.row)"></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door4TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door4TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="!isauth('access_auth_edit')"
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
          </el-table>
        </div>
        <div class="page">
          <el-pagination
            @size-change="fourSizeChange"
            @current-change="fourCurrentChangepage"
            :current-page="fourCurrentPage"
            :page-sizes="[5,10, 20, 30]"
            :page-size="fourPageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="fourrecordCount"
          ></el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
    <div class="page" style="margin-top:20px;">
      <el-button type="primary" @click="onKeep" size="mini" v-if="isauth('access_auth_edit')">保存</el-button>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loadingUser: false,
      loading: false,
      loading1: false,
      ruleForm: { roleGuid: '', departmentGuid: '', userName: '' },
      rules: {
        roleGuid: [{ required: true, message: '请选择角色', trigger: 'blur' }]
      },
      // 部门列表
      departmentInfo: [],
      // 角色列表
      roleInfo: [],
      /**
       * 人员
       */
      isUserAll: false,
      // 全部人员列表
      personnelDataAll: [],
      // 显示人员列表
      personnelData: [],
      // 被选中的人员
      personnelChageList: [],
      // 人员列表分页
      pageNum: 1,
      currentPage: 1,
      pageSize: 10,
      recordCount: 0,

      /**
       * 设备
       */
      activeName: 'thirdone',
      // activeName: 'thirdtwo',
      /**
       * 双门
       */
      // 改变选中
      elformTwo: {
        sunday: false,
        monday: false,
        tuesday: false,
        wednesday: false,
        thursday: false,
        friday: false,
        saturday: false,
        backLock: false,
        sundayTimeStageIndex: 0,
        mondayTimeStageIndex: 0,
        tuesdayTimeStageIndex: 0,
        wednesdayTimeStageIndex: 0,
        thursdayTimeStageIndex: 0,
        fridayTimeStageIndex: 0,
        saturdayTimeStageIndex: 0,
        holidayTimeStageIndex: 0,
        exceptionTimeStageIndex: 0,
        startTime: this.getNowTime('yy-mm-dd 00'),
        endTime: this.getNowTime('yy-mm-dd 59'),
        doorPassword: '',
        door1: true,
        door2: false
      },
      isTwoAll: false,
      //双门所有设备
      detailslistAll: [],
      // 双门设备信息
      detailslist: [],
      // 被选中的双门设备
      towDoorChangeList: [],
      // 默认双门设备列表
      defaultDevice: [],
      // 双门设备分页
      devicepageNum: 1,
      deviceCurrentPage: 1,
      devicePageSize: 10,
      devicerecordCount: 0,
      /**
       * 四门
       */
      elformFour: {
        sunday: false,
        monday: false,
        tuesday: false,
        wednesday: false,
        thursday: false,
        friday: false,
        saturday: false,
        door1TimeStageIndex: 0,
        door2TimeStageIndex: 0,
        door3TimeStageIndex: 0,
        door4TimeStageIndex: 0,
        door1: true,
        door2: false,
        door3: false,
        door4: false
      },
      isFourAll: false,
      // 四门所有设备信息
      fourDoorListAll: [],
      // 四门设备信息
      fourDoorList: [],
      // 被选中的四门设备
      fourDoorChangeList: [],
      // 默认四门设备列表
      fourDefaultDevice: [],
      // 4门设备分页
      fourpageNum: 1,
      fourCurrentPage: 1,
      fourPageSize: 10,
      fourrecordCount: 0
    }
  },
  created() {
    // 部门查询
    this.getDepartment()
    // 角色查询
    this.getroleInfo()
    // 设备查询
    this.getDetailslist()
    this.getfourDoorList()
  },
  computed: {
    changeschoolid: {
      get() {
        return this.$store.state.user.changeschoolid
      }
    },
    userName: {
      get() {
        return this.$store.state.user.name
      }
    }
  },
  methods: {
    // 重置条件
    resetFilter(formName) {
      console.log(this.elformTwo)
      this.$refs[formName].resetFields()
    },

    // 部门查询
    getDepartment() {
      this.$http({
        url: this.$http.adornUrl('/department/query-department-info'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          console.log(data.messageContent)
          this.departmentInfo = data.messageContent
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 角色查询
    getroleInfo() {
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-role-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          console.log(data.messageContent)
          this.roleInfo = data.messageContent
          // if (this.roleInfo.length != 0) {
          //   this.$set(this.ruleForm, "roleGuid", this.roleInfo[0].roleGuid);
          // }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 查询
    onSubmit() {
      // 重置第一页
      this.pageNum = 1
      this.getpersonnelData()
    },
    // 人员查询
    getpersonnelData() {
      let searchInfo = {
        unitGuid: this.changeschoolid
      }
      searchInfo.departmentGuid = this.ruleForm.departmentGuid
      searchInfo.userName = this.ruleForm.userName
      searchInfo.roleGuid = this.ruleForm.roleGuid
      this.loadingUser = true
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-role-user-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            ...searchInfo
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loadingUser = false
        if (data.messageCode == 200) {
          let list = []
          let arrto = data.messageContent || []
          arrto.map((item, index) => {
            item.isCheck = this.isUserAll
            item.id = index
            list.push(item)
          })
          this.personnelDataAll = list
          this.getUser(this.pageNum, this.pageSize)
          this.recordCount = list.length
          if (arrto.length == 0) {
            this.$message({
              message: '查询成功，该角色当前条件下暂无绑定的人员',
              type: 'success'
            })
          }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },

    /**人员选择*/
    personnelChange() {
      let arr = []
      console.log(this.personnelDataAll)
      this.personnelDataAll.map(item => {
        if (item.isCheck) {
          console.log(item)
          arr.push(item)
        }
      })
      this.personnelChageList = arr
    },
    /**
     * 自己分页
     */
    getUser(pagenum, pagesize) {
      this.personnelData = this.personnelDataAll.slice(
        (pagenum - 1) * pagesize,
        pagenum * pagesize
      )
    },
    // 选中数据
    CheckUserSelect(val, row) {
      console.log(val, row)
      // 因为是用索引当做id的。
      this.personnelDataAll[row.id].isCheck = val
    },
    // 全选按钮
    CheckUserAll(val) {
      this.isUserAll = val
      this.personnelDataAll.map(item => {
        item.isCheck = val
      })
    },
    // 人员分页函数
    handleSizeChange(val) {
      this.pageSize = val
      this.getUser(this.pageNum, this.pageSize)
    },
    handleCurrentChangepage(val) {
      this.pageNum = val
      this.getUser(this.pageNum, this.pageSize)
    },

    /**
     * 双门
     */

    // 双门设备查询
    getDetailslist() {
      this.loading = true
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-terminal-two-door-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loading = false
        if (data.messageCode == 200) {
          console.log(data.messageContent.data)
          let roomList1 = JSON.parse(JSON.stringify(data.messageContent || []))
          roomList1.map((item, index) => {
            // 星期
            item.monday = item.monday == 1 ? true : false
            item.tuesday = item.tuesday == 1 ? true : false
            item.wednesday = item.wednesday == 1 ? true : false
            item.thursday = item.thursday == 1 ? true : false
            item.friday = item.friday == 1 ? true : false
            item.saturday = item.saturday == 1 ? true : false
            item.sunday = item.sunday == 1 ? true : false
            // 反锁
            item.backLock = item.backLock == 1 ? true : false
            item.isCheck = this.isTwoAll
            item.id = index
          })
          this.detailslistAll = roomList1
          this.getTwoList(this.devicepageNum, this.devicePageSize)
          this.devicerecordCount = roomList1.length
          this.defaultDevice = JSON.parse(JSON.stringify(roomList1))
          // this.devicerecordCount = data.messageContent.recordCount
          console.log(this.detailslist)
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    /**
     * 双门自己分页
     */
    getTwoList(pagenum, pagesize) {
      this.detailslist = this.detailslistAll.slice(
        (pagenum - 1) * pagesize,
        pagenum * pagesize
      )
    },
    // 选中数据
    CheckTwoSelect(val, row) {
      console.log(val, row)
      // 因为是用索引当做id的。
      this.detailslistAll[row.id].isCheck = val
      console.log(this.detailslistAll)
    },
    // 全选按钮
    CheckTwoAll(val) {
      this.isTwoAll = val
      this.detailslistAll.map(item => {
        item.isCheck = val
      })
      console.log(this.detailslistAll)
    },
    // 前端分页 双门设备
    deviceSizeChange(val) {
      console.log(val)
      this.devicePageSize = val
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    deviceCurrentChangepage(val) {
      this.devicepageNum = val
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    // 双门设备选择
    equipmentChange(val) {
      // console.log(val)
      // this.towDoorChangeList = val
      let arr = []
      console.log(this.personnelDataAll)
      this.detailslistAll.map(item => {
        if (item.isCheck) {
          console.log(item)
          arr.push(item)
        }
      })
      this.towDoorChangeList = arr
    },
    // 修改选中的双门控制器
    editTwoEquipment() {
      // this.detailslistAll.forEach((item, index) =>{
      //   let old = this.detailslistAll[index];
      //   this.detailslistAll[index] = {...old, ...this.elformTwo}
      // })
      this.detailslistAll.map((item, index) => {
        if (item.isCheck) {
          let old = item
          this.detailslistAll[index] = { ...old, ...this.elformTwo }
          console.log(item)
        }
      })
      console.log(this.detailslistAll)
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    // 双门时间选中后触发
    handleTwoSelect(row) {
      //  this.detailslistAll[row.id] = row
      this.detailslistAll[row.id].isCheck = true
      console.log(this.detailslistAll)
      // console.log(row)
      // if (this.towDoorChangeList.indexOf(row) == -1) {
      //   if (row) {
      //     this.$refs.twoTable.toggleRowSelection(row)
      //   }
      // }
    },
    // 双门多选框是否选中
    handleTwoChange(row) {
      this.detailslistAll[row.id].isCheck = true

      // if (this.towDoorChangeList.indexOf(row) == -1) {
      //   if (row) {
      //     this.$refs.twoTable.toggleRowSelection(row)
      //   }
      // }
    },
    /**四门 */
    // 修改选中的四门控制器
    editFourEquipment() {
      this.fourDoorListAll.map((item, index) => {
        if (item.isCheck) {
          let old = item
          this.fourDoorListAll[index] = { ...old, ...this.elformFour }
          console.log(item)
        }
      })
      console.log(this.fourDoorListAll)
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },
    // 四门设备查询
    getfourDoorList() {
      this.loading1 = true
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-terminal-four-door-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loading1 = false
        if (data.messageCode == 200) {
          console.log(data.messageContent.data)
          let roomList1 = JSON.parse(JSON.stringify(data.messageContent || []))
          roomList1.map((item, index) => {
            // 星期
            item.monday = item.monday == 1 ? true : false
            item.tuesday = item.tuesday == 1 ? true : false
            item.wednesday = item.wednesday == 1 ? true : false
            item.thursday = item.thursday == 1 ? true : false
            item.friday = item.friday == 1 ? true : false
            item.saturday = item.saturday == 1 ? true : false
            item.sunday = item.sunday == 1 ? true : false
            // 反锁
            item.backLock = item.backLock == 1 ? true : false
            item.isCheck = this.isFourAll
            item.id = index
          })

          this.fourDoorListAll = roomList1
          this.getFourList(this.fourpageNum, this.fourPageSize)
          this.fourrecordCount = roomList1.length
          this.fourDefaultDevice = JSON.parse(JSON.stringify(roomList1))

          // this.fourrecordCount = data.messageContent.recordCount
          // this.fourDoorList = roomList1
          // console.log(this.fourDoorList)
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },

    // 四门时间选中后触发
    handleFourSelect(row) {
      this.fourDoorListAll[row.id].isCheck = true
      console.log(this.fourDoorListAll)
      // console.log(row)
      // if (this.fourDoorChangeList.indexOf(row) == -1) {
      //   if (row) {
      //     this.$refs.fourTable.toggleRowSelection(row)
      //   }
      // }
    },
    // 四门多选框是否选中
    handleFourChange(row) {
      this.fourDoorListAll[row.id].isCheck = true
      console.log(this.fourDoorListAll)
      // if (this.fourDoorChangeList.indexOf(row) == -1) {
      //   if (row) {
      //     this.$refs.fourTable.toggleRowSelection(row)
      //   }
      // }
    },
    // 四门设备选择
    fourChange(val) {
      let arr = []
      console.log(this.fourDoorListAll)
      this.fourDoorListAll.map(item => {
        if (item.isCheck) {
          console.log(item)
          arr.push(item)
        }
      })
      this.fourDoorChangeList = arr
    },
    /**
     * 自己分页
     */
    getFourList(pagenum, pagesize) {
      this.fourDoorList = this.fourDoorListAll.slice(
        (pagenum - 1) * pagesize,
        pagenum * pagesize
      )
    },
    // 选中数据
    CheckFourSelect(val, row) {
      // 因为是用索引当做id的。
      this.fourDoorListAll[row.id].isCheck = val
      console.log(this.fourDoorListAll)
    },
    // 全选按钮
    CheckFourAll(val) {
      this.isFourAll = val
      this.fourDoorListAll.map(item => {
        item.isCheck = val
      })
      console.log(this.fourDoorListAll)
    },
    // 四门设备分页函数
    fourSizeChange(val) {
      this.fourPageSize = val
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },
    fourCurrentChangepage(val) {
      this.fourpageNum = val
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },

    // 将数据转为0，1
    getRoomList(arr) {
      if (arr.length == 0) {
        return []
      }
      let arr1 = JSON.parse(JSON.stringify(arr))
      arr1.map(item => {
        // 反锁
        item.backLock = item.backLock ? 1 : 0
        item.monday = item.monday ? 1 : 0
        item.tuesday = item.tuesday ? 1 : 0
        item.wednesday = item.wednesday ? 1 : 0
        item.thursday = item.thursday ? 1 : 0
        item.friday = item.friday ? 1 : 0
        item.saturday = item.saturday ? 1 : 0
        item.sunday = item.sunday ? 1 : 0
      })
      console.log(arr1)
      return arr1
    },

    // 保存
    onKeep() {
      this.personnelChange()
      console.log(this.personnelChageList)
      let arr = JSON.parse(JSON.stringify(this.personnelChageList))
      if (this.personnelChageList.length == 0) {
        this.$message({
          message: '请选择人员',
          type: 'warning'
        })
        return false
      }

      // 双门
      if (this.activeName === 'thirdone') {
        // 获取选中数据
        this.equipmentChange()
        if (this.towDoorChangeList.length == 0) {
          this.$message({
            message: '请选择双门设备',
            type: 'warning'
          })
          return false
        }
        // 双门选中数据
        let arr1 = JSON.parse(JSON.stringify(this.towDoorChangeList))
        let arr2 = this.getRoomList(arr1)
        let newArr = []
        arr2.map(towDoorItem => {
          arr.map(personnelItem => {
            newArr.push({
              ...towDoorItem,
              cardNumber: personnelItem.cardNumber,
              userGuid: personnelItem.userGuid,
              unitGuid: this.changeschoolid
            })
          })
        })
        this.setTwoDoor(newArr)
        this.towDoorChangeList = []
        // 初始化
        this.detailslistAll = JSON.parse(JSON.stringify(this.defaultDevice))
        this.getTwoList(this.devicepageNum, this.devicePageSize)
      } else if (this.activeName === 'thirdtwo') {
        // 选中数据
        this.fourChange()
        // 四门
        if (this.fourDoorChangeList.length == 0) {
          this.$message({
            message: '请选择四门设备',
            type: 'warning'
          })
          return false
        }
        // 四门选中数据
        let arr1 = JSON.parse(JSON.stringify(this.fourDoorChangeList))
        let arr2 = this.getRoomList(arr1)
        let newArr = []
        arr2.map(towDoorItem => {
          arr.map(personnelItem => {
            newArr.push({
              ...towDoorItem,
              cardNumber: personnelItem.cardNumber,
              userGuid: personnelItem.userGuid,
              unitGuid: this.changeschoolid
            })
          })
        })
        this.setFourDoor(newArr)
        // 初始化
        this.fourDoorChangeList = []
        this.fourDoorListAll = JSON.parse(
          JSON.stringify(this.fourDefaultDevice)
        )
        this.getFourList(this.fourpageNum, this.fourPageSize)
      }
    },
    // 双门添加请求
    setTwoDoor(newArr) {
      // 批量加载条
      this.loadingZ = this.Loading.service({
        lock: true,
        text: '正在授权中,请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-two-door-add'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: newArr,
          messageType: 0
        })
      }).then(({ data }) => {
        this.loadingZ.close()
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '双门授权成功'
          })
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 四门添加请求
    setFourDoor(newArr) {
      // 批量加载条
      this.loadingZ = this.Loading.service({
        lock: true,
        text: '正在授权中,请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-four-door-add'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: newArr,
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.loadingZ.close()
          this.$message({
            type: 'success',
            message: '四门授权成功'
          })
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.box {
  padding: 10px;
  .demo-form-inline.el-form.el-form--inline {
    padding-left: 10px;
  }
  .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 5px;
  }

  .el-table__body tr,
  .el-table__body td {
    padding: 0;
    height: 20px;
  }
  h4 {
    margin-top: 0;
    margin-bottom: 5px;
  }
  .table_scroll {
    //滚动条的宽度
    ::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }
    //滚动条的滑块
    ::-webkit-scrollbar-thumb {
      background-color: #a1a3a9;
      border-radius: 3px;
    }
  }
  //滚动条的宽度
  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }
  //滚动条的滑块
  ::-webkit-scrollbar-thumb {
    background-color: #a1a3a9;
    border-radius: 3px;
  }
}
.marginLift {
  margin-left: 15px;
}
.page {
  display: flex;
  justify-content: center;
  align-items: center;
}

.TimeWeek {
  padding: 20px 0 0;
}
.el-dialog--center .el-dialog__body {
  padding: 0 50px;
}
</style>
